<script setup lang="ts">
import { useCounterStore } from '@/stores/counter'
import { storeToRefs } from 'pinia'

const counter = useCounterStore()
const { count, doubleCount } = storeToRefs(counter)

const handleClick = () => {
  counter.increment()
}
</script>

<template>
  <main>
    <van-button type="primary" @click="handleClick">count++</van-button>
    <div>
      <p>counter.count: {{ counter.count }}</p>
      <p>counter.doubleCount: {{ counter.doubleCount }}</p>
    </div>
    <br />
    <div>
      <p>count: {{ count }}</p>
      <p>doubleCount: {{ doubleCount }}</p>
    </div>
  </main>
</template>
